<template>
    <div class="new-discover" v-cloak id="listWrapper">
        <Swiper :imgList="imgList"></Swiper>
        <List :listData="listData" :basicInfo="basicInfo" v-if="listData && listData.length > 0"></List>
    </div>
</template>

<script>
    import common from '../../../assets/js/common';
    import url  from 'url';
    import qs from 'querystring';
    import drop from "../../../assets/js/dropload.min.js";
    import { Toast } from 'mint-ui';

    import Swiper from '../components/swiper.vue';
    import List from '../components/listcomponent.vue';

    export default{
        data (){
            return {
                basicInfo: {
                    appVersion: '4.1',
                    plateformType: 'both',
                    cityCode: '310100'
                },
                swiperPromise: null,
                imgList: [],
                listData: []
            };
        },
        components: {
            Swiper: Swiper,
            List: List
        },
        created (){
            let tar = url.parse(window.location.href).query;
            let tmpObj = qs.parse(tar);
            this.basicInfo.appVersion = tmpObj.appVersion || '4.1';            // 默认版本
            this.basicInfo.plateformType = tmpObj.plateformType || 'both';   // 默认平台 both android 和 ios 都可用
            this.basicInfo.cityCode = tmpObj.cityCode || '310100';            // 城市code

            let swiperParams = {
                cityCode: this.basicInfo.cityCode,
                plateformType: this.basicInfo.plateformType,
                appVersion: this.basicInfo.appVersion
            };

            this.swiperPromise = this.$http.get(common.isdev() + '/service/discovery/banner/0', {params: swiperParams});
        },
        mounted (){
            this.swiperPromise.then((res) => {          // banner轮播图片请求
                if (!(res.body.errorCode * 1)) {
                    this.imgList = res.body.result;
                }
            },(err) => {
                Toast('服务器异常');
            });
            this.getList();
            common.ANA_AnalyticsScan();
        },
        methods: {
            getList() {
                let page = 0;
                let _this = this;
                let listParams = {
                    typeValue: this.basicInfo.artColumn,                    // 栏目id
                    cityCode: this.basicInfo.cityCode,
                    appVersion: this.basicInfo.appVersion,
                    plateformType: this.basicInfo.plateformType,
                    pageIndex: page + '',
                    pageSize: '10'
                };
                $('#listWrapper').dropload({
                    scrollArea : window,
                    domDown : {
                        domClass   : 'dropload-down',
                        domRefresh : '<div class="dropload-refresh">↑上拉加载更多</div>',
                        domUpdate  : '<div class="dropload-update">↓释放加载</div>',
                        domLoad    : '<div class="dropload-load"><span class="loading"></span>加载中...</div>',
                        domNoData  : '<div class="dropload-noData">没有更多了</div>'
                    },
                    loadDownFn : function(me){
                        listParams.pageIndex = (page++) + '';
                        $.ajax({
                            type: 'GET',
                            url: common.isdev() + '/service/sayCars/articles/0',
                            data: listParams,
                            dataType: 'json',
                            success: function(response){
                                if (!(response.errorCode * 1)) {
                                    let result = response.result;
                                    let totalPage = Math.ceil(result.total/result.pageSize);
                                    if (page > totalPage) {
                                        me.lock();
                                        me.noData();
                                    } else {
                                        _this.listData = _this.listData.concat(result.articles);
                                    }
                                    _this.$nextTick(function () {
                                        common.ANA_AnalyticsScan();
                                    });
                                    setTimeout(function(){
                                        me.resetload();
                                    }, 1000);
                                } else {
                                    Toast('服务器异常');
                                }
                            },
                            error: function(xhr, type){
                                Toast('服务器异常');
                            }
                        });
                    }
                })
            }
        }
    }
</script>

<style lang="scss">
    @import '../../../assets/css/common';
    @import '../../../assets/css/dropload.css';
    body {
        background: #f5f5f5;
        .dropload-refresh, .dropload-update, .dropload-load, .dropload-noData{
            color: #8392A0;
            font-size: 13px;
        }
    }
</style>
